<template name="sendcar">
	<!-- 待借出工具 -->
	<view class="mypage">
		<view class="cu-bar search bg-white">
			<view class="search-form round">
				<text class="cuIcon-search"></text>
				<input type="text" placeholder="请输工具名称" v-model="keyword" />
				<input type="text" placeholder="请输工具资规格" v-model="keyword2" />
				<!-- <input type="text" placeholder="输入工具名称" v-model="keyword" /> -->
			</view>

			<view class="action">
				<button class="cu-btn bg-blue shadow-blur round" @tap="handelSearch">搜索</button>
			</view>
		</view>

		<view class="card-list-wrapper">
			<view class="card-list-row radius shadow-warp bg-white margin-top" v-for="(item,index) in planList"
				:key="index">

				<view class="flex-just-between bottom-border top-wrap">
					<text class="text-blue text-bold">工具单号：{{ item.PK_MATERIAL || '' }}</text>
					<view class="cu-capsule radius">
						<view class='cu-tag bg-blue sm'>
							<text class='cuIcon-medal'></text>
						</view>
						<view class="cu-tag line-brown sm">
							{{ index+1}}
						</view>
					</view>
				</view>

				<view class="card-list-row-1 margin-top">
					<text class="cuIcon-title text-red"></text>
					<text>名称：{{ item.MATERIALNAME || '' }}</text>
				</view>

				<view class="card-list-row-1">
					<text class="cuIcon-title text-orange"></text>
					<text>规格：{{ item.MATSPEC || '' }}</text>
					<!-- <text class="text-blue">&emsp; {{ item.NNUMSQ || '' }}</text> -->
				</view>
				
				<view class="card-list-row-1" v-if="BBStype == 1">
					<text class="cuIcon-title text-red"></text>
					<text>借出数量：{{ item.NNUM || '' }}</text>
				</view>
				<view class="card-list-row-1" v-else>
					<text class="cuIcon-title text-orange"></text>
					<text>申请量：{{ item.NNUM || '0' }} </text>
				</view>

				<view class="card-list-row-1">
					<text class="cuIcon-title text-red"></text>
					<text>货位：{{ item.STATIONNAME || '' }}</text>
				</view>

				<view class="position-a checkFlag" v-if="item.ischeck">
					<text class="cuIcon-squarecheckfill text-blue"></text>
				</view>
				<view class="flex-just-center margin-top btn-wrap">
					<button class="cu-btn round lines-blue" @click="openDetail(item)">
						{{ BBStype == 1?'立即归还':'立即借出' }}
					</button>
				</view>

			</view>
		</view>

	</view>

</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import api from '@/common/api.js';
	import utils from '@/common/util.js';
	import modal from '@/components/modal/modal_mater.vue'
	let query = {
		"category": "",
		"page": 1,
		"rows": "10",
		"sidx": "CREATIONTIME",
		"sord": "desc",
		"queryJson": "",
		"userId": "",
		"account": ""
	}
	let _self, menuType, page = 1,bsType = 0 ,
		billID,
		total = 1,
		goPath = '',
		queryJson = {};

	export default {
		computed: mapState(['userInfo', 'baseUrl', 'checkData']),
		data() {
			return {
				planList: [],
				keyword: '',
				keyword2: '',
				category: '',
				isShowModal: false,
				config: {
					materId: '',
					materName: ''
				},
				BBStype: ''
			};
		},

		onLoad(p) {
			_self = this;
			bsType = p.auth == 'C1006'? '1':'0'  // 1  归还
			this.BBStype = bsType
			// console.log(_self.userInfo)
			menuType = p.sqlTbName;
			queryJson = {}
			getApp().globalData.queryJsonLS = null 
			query.category = "ST_STOCKINFO"; // 
			query.userId = _self.userInfo.UserId;
			query.account = _self.userInfo.Account;
			queryJson.PK_ORG = _self.userInfo.ORGANIZEID;
			page = 1;
			total = 1;
			_self.planList = [];
			this.getList();
			this.listenOnce()
		},
		components: {
			modal
		},
		onNavigationBarButtonTap(e) {
			if(e.index==0){
				this.listenOnce()
				uni.navigateTo({
					url: '/pages/public/query?type=menu1012'
				})
			}else{
				_self.openScanMater();
			}
		},
		

		onUnload() {
			// 移除监听事件  
			uni.$off('getSelectItem');
		},

		//下拉刷新
		onPullDownRefresh: function() {
			// 重置分页及数据
			page = 1;
			total = 1;
			_self.planList = [];
			this.getList();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
			uni.showToast({
				"title": "数据已刷新",
				icon: "none"
			});
		},
		// 加载更多
		onReachBottom: function() {
			this.getList();
		},
		methods: {
			...mapMutations(['setCheckData']),

			listenOnce() {
				// 刷新列表
				uni.$on('refreshList', () => {
					page = 1;
					total = 1;
					_self.planList = [];
					_self.setCheckData([]);
					this.getList();
				})
				uni.$off('reload')
				uni.$once("reload", function(data) {
					queryJson= { ...queryJson , ...data }
					getApp().globalData.queryJsonLS = queryJson
					_self.handelSearch()
				});
				// 删除物资后执行状态修改
				uni.$on('deleteEvent', d => {
					this.planList[d].ischeck = false
				})
			},

			select() {
				let queryParmes = {
					PK_ORG: _self.userInfo.ORGANIZEID
				};
				uni.navigateTo({
					url: "/pages/public/search?t=BD_STORE&queryjson=" +
						JSON.stringify(queryParmes)
				});
			},
			openDetail(e) {
				this.setCheckData([e]);
				let URL = '/api/APPCommon/OpenCabinet';
				_self.axios({
						url: URL,
						data: e,
						isLoading: true
					})
					.then(res => {
						let path = this.BBStype==1?'tool-in?t=': 'tool-out?t='
						uni.navigateTo({ // 借出
							url: path +this.BBStype 
						})
					})

			},
			handelSearch() {
				queryJson.MATERIALNAME = _self.keyword
				queryJson.MATSPEC = _self.keyword2
				// queryJson.VNAME = _self.keyword
				queryJson.PK_ORG = _self.userInfo.ORGANIZEID
				page = 1;
				total = 1;
				_self.planList = [];
				this.getList();
			},
			
			getList() {
				if (page > total) {
					return utils.tips('没有数据了')
				}
				query.page = page
				query.queryJson = JSON.stringify(queryJson);
				let URL = bsType == 1 ? '/api/APPCommon/ReturnToolList' : '/api/APPCommon/LendToolList';
				_self.axios({
						url: URL,
						data: query,
						isLoading: true
					})
					.then(res => {
						let {
							Result,
							Message
						} = res;
						console.log(12, Result);
						let TS= bsType ==1 ? '待归还':'待借出' 
						_self.setPageTitle( TS + '工具列表(' + Result.records + ')')
						let array = Result.rows.map((item) => {
							item.ischeck = false;
							item.RPSTATUS = '0'
							item.LENDNNUM = item.NNUM; // 借出数量
							item.ENNUM = ''; // 归还数量
							item.TARENNUM = '' // 已归还数量
							item.WAITNNUM = '' // 待归还数量
							return item;
						})
						page == 1 ? (_self.planList = array) : (_self.planList = _self.planList.concat(array))
						total = Result.total
						page++
					})

			},
			setPageTitle(d) {
				uni.setNavigationBarTitle({
					title: d
				});
			},

			// 控制高级查询条件
			cancelModal() {
				this.isShowModal = false
			},
			okModal(val) {
				this.cancelModal();
				queryJson = {
					...val
				};
				page = 1;
				total = 1;
				_self.planList = [];
				this.getList();
			},

			// 扫描物资
			openScanMater() {
				let URL = api.apiPublic.ScanCode;
				this.$utils.Scan(URL, item => {
					item.ischeck = false;
					item.LENDNNUM = '1'; // 借出数量
					item.ENNUM = ''; // 归还数量
					item.TARENNUM = '' // 已归还数量
					item.WAITNNUM = '' // 待归还数量
					_self.planList = [];
					_self.planList.push(item);
				});
			},

		}
	}
</script>

<style scoped>
	.height50 {
		height: 50px;
	}

	.card-list-wrapper {
		width: 710upx;
		height: 100upx;
		margin: 0 auto;

	}

	.card-list-row {
		padding: 20upx;
	}

	.card-list-row-1 {
		padding: 10upx 0;
	}

	.top-border {
		border-top: 1upx solid rgba(0, 0, 0, .1);
	}

	.top-wrap {
		padding-bottom: 20upx;
	}

	.bottom-border {
		border-bottom: 1upx solid rgba(0, 0, 0, .1);
	}

	.btn-wrap {
		padding-top: 20upx;
	}

	.checkFlag {
		top: 50%;
		right: 20upx;
		font-size: 40upx;
	}

	.next-btn-wrap {
		position: fixed;
		right: 50upx;
		bottom: 100upx;
	}

	.big-btn {
		width: 100upx;
		height: 100upx;
		border-radius: 50upx;
		font-size: 40upx;
	}
</style>
